﻿@model AddressModel
@using Logistics.Web.Models.Common
@using Logistics.Web.Models.Order;
@{
    ViewBag.Title = "Create Order";
    ViewBag.Fixed = true;
    Layout = "_Layout.cshtml";
}
<div class="logistics-orderinfo">
    @Html.Action("ShippingWarnings", "Common", new { area = "" })

    <div class="window-left-block order-shipping col-ms-12 col-xs-12 col-sm-12 col-md-9 col-lg-9">

        <div class="window orderlocation-window" id="@Logistics.Web.Models.Order.CommonValues.LocationInfoViewName">
            <div class="window-title grad-lightgrey grad">
                <div class="window-title-bar grad-titleshine grad">
                    <h2>Shipping Information<span class="location-id"></span></h2>
                </div>
            </div>
            <div class="window-content order-content"></div>
        </div>

        <div class="window orderpackage-window" id="@Logistics.Web.Models.Order.CommonValues.PackageInfoViewName">
            <div class="window-title grad-lightgrey grad">
                <div class="window-title-bar grad-titleshine grad">
                    <h2>Package <span class="location-id"><span class="package-id"></span></span></h2>
                </div>
            </div>
            <div class="window-content order-content"></div>
        </div>

        <div class="window orderdetail-window" id="@Logistics.Web.Models.Order.CommonValues.DetailViewName">
            <div class="window-title grad-lightgrey grad">
                <div class="window-title-bar grad-titleshine grad">
                    <h2>Order Details<span class="location-id"></span></h2>
                </div>
            </div>
            <div class="window-content order-content"></div>
        </div>
    </div>
    <div class="col-ms-12 col-xs-12 col-sm-12 col-md-3 col-lg-3 window-right-bar">
        <div id="ordersummary-window"></div>
        <div>
            <span id="siteseal">
                <script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=Jytz1t4GhFQwX8kC4frE2fdheYs8Uuu8MDXKUVPcqpTsuAxRQyT8g20Y"></script>
            </span>

        </div>
    </div>

    <div class="clear"></div>
</div>
<script>

    //Disable enter key

    $('html').bind('keypress', function (e) {
        if (e.keyCode == 13) {
            return false;
        }
    });

    // Set up element when page loads

    $('.window-right-bar').show();
    var leftblockWidth = $('.window-left-block').outerWidth();
    $('.order-content').css({ "height": 0, "opacity": 0 });
    //$('.window-left-block').css({ "width": "100%" });
    $('.window-left-block > div.window').css({ "opacity": "0" });
    // Init at document load

    $(document).ready(function () {
        $('#ajax-notification, .ajax-loading-wrapper').show();
        shippingAjaxCall("/express/order/initview");
    }).keydown(function () {
        if (window.event.keyCode == 8) {
            // Cancel backspace if not in a text element
            if (document.activeElement.type != "text") {
                window.event.returnValue = false;
            }
        }
    });

    // Submit Ajax behaviour

    $('input.cancel-location').live("click", function () {
        $('.ajax-loading-wrapper').hide();
        $('.ajax-loading-box .title').html('<h2><span class="red">Spots</span>HUB</h2>');
        $('.ajax-loading-box .content').html('<p>Cancelling this order will also remove ALL packages from this order. Are you sure you want to cancel this order?</p><div class="ajax-notification-buttons ajax-cancel-location two"><a class="ajax-notification-continue button-red">Yes</a><a class="ajax-notification-decline button-grey">No</a></div>');
        $('#ajax-notification, .ajax-loading-box').fadeIn(function () {
            $('#ajax-loading-bar').hide();
        });

    });

    $('.shippinginfo-continue a, .shippinginfo-nocontinue a').live("click", function () {
        var clickedButton = $(this);
        $('.clicked').removeClass(".clicked").show();
        $('#ajax-loading-bar').hide();
        clickedButton.addClass("clicked");
        clickedButton.parent().children().hide();
        $('#ajax-loading-bar').clone().show().css({
            "display": "inline-block",
            "float": clickedButton.css("float"),
            "width": 150,
            "height": 30,
            "margin-top": clickedButton.css("margin-top"),
            "margin-bottom": clickedButton.css("margin-bottom"),
            "margin-left": clickedButton.css("margin-left"),
            "margin-right": clickedButton.css("margin-right")
        }).appendTo(clickedButton.parent());
    });
    $('input[type=submit]').live("click", function (e) {
        if ($(this).closest(".location-group").length) {
            $('body').css("overflow", "auto");
            $(this).closest(".location-group").fadeOut();
        }
        if ($(this).hasClass("loading-continue")) {
            var clickedButton = $(this);
            $('.clicked').removeClass(".clicked").show();
            $('#ajax-loading-bar').hide();
            clickedButton.addClass("clicked");
            $('#ajax-loading-bar').clone().show().css({
                "display": clickedButton.css("display"),
                "width": clickedButton.outerWidth(),
                "height": clickedButton.outerHeight(),
                "margin-top": clickedButton.css("margin-top"),
                "margin-bottom": clickedButton.css("margin-bottom"),
                "margin-left": clickedButton.css("margin-left"),
                "margin-right": clickedButton.css("margin-right")
            }).insertAfter(clickedButton);
            clickedButton.hide();
            submitAjaxPrepare(clickedButton);
        } else {
            var clickedButton = $(this);
            $('.clicked').removeClass(".clicked").show();
            $('#ajax-loading-bar').hide();
            $('.clickedButton').removeClass('clickedButton');
            clickedButton.addClass("clicked").addClass("clickedButton");
            clickedButton.parent().children().hide();
            $('#ajax-loading-bar').clone().show().css({
                "display": "inline-block",
                "float": clickedButton.css("float"),
                "width": 150,
                "height": 30,
                "margin-top": clickedButton.css("margin-top"),
                "margin-bottom": clickedButton.css("margin-bottom"),
                "margin-left": clickedButton.css("margin-left"),
                "margin-right": clickedButton.css("margin-right")
            }).appendTo(clickedButton.parent());
            if ($(this).hasClass("remove-package")) {
                $('.ajax-loading-wrapper').hide();
                $('.ajax-loading-box .title').html('<h2><span class="red">Spots</span>HUB</h2>');
                $('.ajax-loading-box .content').html('<p>Are you sure you want to remove this package from your order?</p><div class="ajax-notification-buttons ajax-cancel-package two"><a class="ajax-notification-continue button-red">Yes</a><a class="ajax-notification-decline button-grey">No</a></div>');
                $('#ajax-notification, .ajax-loading-box').fadeIn(function () {
                    clickedButton.parent().children().show();
                    clickedButton.parent().find('#ajax-loading-bar').remove();
                    $('#ajax-loading-bar').hide();
                });
            }
                //Only for Nosignature info
            else if ($(this).attr("id") == "check-nosignature" && $("input#NoSignature:checked").val() == "True") {
                $('.ajax-loading-wrapper').hide();
                $('.ajax-loading-box .title').html('<h2><span class="red">Spots</span>HUB</h2>');
                $('.ajax-loading-box .content').html('<p>@T("Logistics.Order.NoSignature.Warning").Text </p><div class="ajax-notification-buttons ajax-cancel-package two"><a class="ajax-notification-continue button-grey">@T("Logistics.Common.Proceed").Text</a><a class="ajax-notification-decline button-grey">@T("Logistics.Common.Cancel").Text</a></div>');
                $('#ajax-notification, .ajax-loading-box').fadeIn(function () {
                    clickedButton.parent().children().show();
                    clickedButton.parent().find('#ajax-loading-bar').remove();
                    $('#ajax-loading-bar').hide();
                });
            }
            else {
                submitAjaxPrepare(clickedButton);
                $('.clickedButton').removeClass('clickedButton');
            }
        }
        e.stopPropagation;
        return false;
    });

    $('.ajax-cancel-package .ajax-notification-continue').live("click", function () {
        $('#ajax-notification, .ajax-loading-box').fadeOut();
        var clickedButton = $('.clickedButton');
        $('.clickedButton').removeClass('clickedButton');
        submitAjaxPrepare(clickedButton);
    });

    $('.ajax-cancel-location .ajax-notification-continue').live("click", function () {
        $('#ajax-notification, .ajax-loading-box').fadeOut();
        shippingAjaxCall("/express/order/CancelCurrentLocation");
    });

    $('.ajax-notification-decline').live("click", function () {
        $('#ajax-notification, .ajax-loading-box').fadeOut();
    });

    function submitAjaxPrepare(element) {
        var val = ' ', name = ' ';
        if (element.attr('data-value')) {
            val = element.attr('data-value');
        } else if (element.attr('value')) {
            val = element.attr('value');
        }
        if (element.attr("type") == "checkbox") {
            if (element.is(":checked")) {
                val = "true";
            } else {
                val = "false";
            }
        }
        if (element.attr('data-name')) {
            name = element.attr('data-name');
        } else if (element.attr('name')) {
            name = element.attr('name');
        }
        var form = element.closest('form');
        if (name != '' && val != '') {
            form.append('<input id="tempHidden" type="hidden" name="' + name + '" value="' + val + '" />');
        }
        var url = form.attr('action');

        if (element.hasClass('package-submit')) {
            if ($('.weightMeasurement:checked').val() == 'lb') {
                var weightInput = $('.package-weight-input input');
                var packageWeight = weightInput.val();
                if (weightInput.attr('data-floatvalue')) {
                    packageWeight = weightInput.attr('data-floatvalue');
                }
                if (!isNaN(parseFloat(packageWeight)) && isFinite(packageWeight)) {
                    packageWeight = parseFloat(packageWeight) * 0.453592;
                    weightInput.attr('data-tempvalue', weightInput.val()).val(packageWeight.toFixed(2));
                }
            }
            if ($('.lengthMeasurement:checked').val() == 'in') {
                $('.package-measurement-input input').each(function () {
                    var dimensionInput = $(this);
                    var packageDimension = dimensionInput.val();
                    if (dimensionInput.attr('data-floatvalue')) {
                        packageDimension = dimensionInput.attr('data-floatvalue');
                    }
                    if (!isNaN(parseFloat(packageDimension)) && isFinite(packageDimension)) {
                        packageDimension = parseFloat(packageDimension) * 2.54;
                        dimensionInput.attr('data-tempvalue', dimensionInput.val()).val(packageDimension.toFixed(2));
                    }
                });
            }
        }

        var serializedData = form.serialize();

        if (element.hasClass('package-submit')) {
            $('.package-weight-input input, .package-measurement-input input').each(function () {
                if ($(this).attr('data-tempvalue')) {
                    $(this).val($(this).attr('data-tempvalue')).removeAttr('data-tempvalue');
                }
            });
        }

        $('#tempHidden').remove();
        $('.ajax-loading-box').hide();
        $('#ajax-notification, .ajax-loading-wrapper').fadeIn();
        if (element.attr("name") == "addMoreLocation") {
            shippingAjaxCall("/express/order/initview", serializedData);
        } else {
            shippingAjaxCall(url, serializedData);
        }
    }

    function scrollUp(activeWrapperWindow) {
        var windowpos, scrollpos;
        windowpos = $(window).scrollTop();
        if (activeWrapperWindow != null) {
            scrollpos = activeWrapperWindow.offset().top - 10;
        } else {
            scrollpos = $('.window-left-block').offset().top - 10;
        }
        $('html, body').stop().animate({
            scrollTop: scrollpos
        }, 150);
    }

    function shippingAjaxCall(url, serializedData) {
        $.ajax({
            url: url,
            type: "POST",
            data: serializedData,
            timeout: 300000
        }).done(function (data) {
            if (data.name == '@Logistics.Web.Models.Order.CommonValues.FatalErrorName') {
                $('.ajax-loading-wrapper').fadeOut(function () {
                    $('.ajax-loading-box .title').html('<h2>Server Error</h2>');
                    $('.ajax-loading-box .content').html('<p>An error has occured while loading the page content. You may try refresh the page, or go back to My HUB.</p><div class="timeout-buttons"><a href="javascript:void(0)" onclick="document.location.reload();event.stopPropagation();return false;" class="button-grey">Refresh</button>@Html.ActionLink("My HUB", "Info", "Order", new { area = "" }, new { @class = "button-grey" })</div>');
                    $('.ajax-loading-box').fadeIn();
                });
            } else if (data.name == '@Logistics.Web.Models.Order.CommonValues.CouponCodeErrorName') {
                $('.ajax-loading-wrapper').fadeOut(function () {
                    $('.ajax-loading-box .title').html('<h2>Error</h2>');
                    $('.ajax-loading-box .content').html('<p>' + data.message + '</p><div class="timeout-buttons"><a href="javascript:void(0)" onclick="document.location.reload();event.stopPropagation();return false;" class="button-grey">OK</a></div>');
                    $('.ajax-loading-box').fadeIn();
                });
            } else {
                $('#ajax-notification, .ajax-loading-wrapper').fadeOut();
                if ($('#ajax-notification').is(":visible")) {
                    $('#ajax-notification').fadeOut();
                }
                if ($('.window-left-block > div.window').css("opacity") == 0) {
                    $('.window-left-block > div.window').stop().animate({ "opacity": 1 }, function () {
                        orderAjaxHtml(data);
                    })
                } else {
                    orderAjaxHtml(data);
                }
            }

        }).fail(function (obj, type) {
            $('.ajax-loading-box .title').html('<h2>Request Timeout</h2>');
            $('.ajax-loading-box .content').html('<p>There is no response from the server. Please check your internet and try again.</p><div class="timeout-buttons"><a href="javascript:void(0)" onclick="document.location.reload();event.stopPropagation();return false;" class="button-grey">Refresh</a>@Html.ActionLink("My HUB", "Info", "Customer", new { area = "" }, new { @class = "button-grey" })</div>');
            $('.ajax-loading-box').fadeIn();
        });
    }
    function orderAjaxHtml(data) {
        var wrapperWindow, wrapper;
        switch (data.name) {
            case "@Logistics.Web.Models.Order.CommonValues.LocationInfoViewName":
                wrapperWindow = $('#@Logistics.Web.Models.Order.CommonValues.LocationInfoViewName');
                wrapper = $('#@Logistics.Web.Models.Order.CommonValues.LocationInfoViewName .order-content');
                break;
            case "@Logistics.Web.Models.Order.CommonValues.PackageInfoViewName":
                wrapperWindow = $('#@Logistics.Web.Models.Order.CommonValues.PackageInfoViewName');
                wrapper = $('#@Logistics.Web.Models.Order.CommonValues.PackageInfoViewName .order-content');
                break;
            case "@Logistics.Web.Models.Order.CommonValues.DetailViewName":
                wrapperWindow = $('#@Logistics.Web.Models.Order.CommonValues.DetailViewName');
                wrapper = $('#@Logistics.Web.Models.Order.CommonValues.DetailViewName .order-content');
                break;
        }
        if (typeof wrapperWindow != 'undefined' && typeof wrapper != 'undefined') {
            if ($('.activeWrapperWindow').length && $('.activeWrapper').length && !wrapperWindow.hasClass('activeWrapperWindow') && !wrapperWindow.hasClass('activeWrapper')) {
                var activeWrapperWindow = $('.activeWrapperWindow');
                var activeWrapper = $('.activeWrapper');

                $('.window-right-bar').find('.shippinginfo-continue').remove();
                activeWrapper.stop().animate({ "opacity": 0, "height": 0 }, 250, function () {
                    activeWrapper.empty();
                    $('div').removeClass("activeWrapperWindow activeWrapper");
                        orderAjaxExpand(data, wrapper, wrapperWindow);
                });

            } else {
                orderAjaxExpand(data, wrapper, wrapperWindow);
            }
        }
    }

    function orderAjaxExpand(data, wrapper, wrapperWindow) {
        wrapper.html(data.html).stop().animate({ "height": wrapper.children().outerHeight() }, 250, function () {
            wrapper.stop().animate({ "opacity": 1 }).css({ "height": "auto" });
            $('#ordersummary-window').html(data.sumhtml);
            if (data.packageid > 0) {
                $('span.package-id').html(data.packageid);
            }
            else {
                $('span.package-id').html('Information');
            }
            $('.shippinginfo-link').show();
            if (data.cancontinue) {
                $('.shippinginfo-continue').show();
            } else {
                $('.shippinginfo-nocontinue').show();
            }
            wrapperWindow.addClass('activeWrapperWindow');
            wrapper.addClass('activeWrapper');
            scrollUp(wrapperWindow);
        });
    }
</script>
